<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <!-- initial-scale=1.0是确保页面1:1展现，不会出现缩放 -->
    <!-- user-scalable=no在移动端禁止浏览器缩放，和maximum-scale=1.0一起使用 -->
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../css/mypage.css">
    <title>Document</title>
</head>

<body>
    <div class="root">
        <div class="banner">
            <div class="photo">
                <div class="photo_img">
                    <img src="../images/mypage/photo.jpg" alt="">
                </div>
                <span class="name">简希</span>
            </div>
            <div class="center">
                <span href="#" class="component">
                    <span class="num">15</span>
                    <span class="title">我的收藏</span>
                </span>
                <span href="#" class="component">
                    <span class="num">31</span>
                    <span class="title">关注品牌</span>
                </span>
            </div>
        </div>
        <div class="column">
            <div class="top">
                <span class="myoption">我的订单</span>
                <span class="all_option">
                    全部订单
                    <img src="../images/icon/elf_64.png" alt="">
                </span>
            </div>
            <ul class="option">
                <li>
                    <img src="../images/mypage/icon-1.png" alt="">
                    <span>待付款</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-2.png" alt="">
                    <span>待发货</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-3.png" alt="">
                    <span>待收货</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-4.png" alt="">
                    <span>待评价</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-5.png" alt="">
                    <span>售货</span>
                </li>
            </ul>
        </div>
        <div class="column">
            <div class="top">
                <span class="myoption">我的资产</span>
            </div>
            <ul class="option">
                <li>
                    <img src="../images/mypage/icon-6.png" alt="">
                    <span>优惠券</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-7.png" alt="">
                    <span>钱包</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-8.png" alt="">
                    <span>D币</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-9.png" alt="">
                    <span>红包 </span>
                </li>
            </ul>
        </div>
        <div class="column">
            <div class="top">
                <span class="myoption">工具</span>
            </div>
            <ul class="option tool">
                <li>
                    <img src="../images/mypage/icon-10.png" alt="">
                    <span>会员中心</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-11.png" alt="">
                    <span>收货地址</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-12.png" alt="">
                    <span>售货&服务</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-13.png" alt="">
                    <span>设置</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-14.png" alt="">
                    <span>入驻合作</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-15.png" alt="">
                    <span>反馈&投诉</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-16.png" alt="">
                    <span>商品报告</span>
                </li>
                <li>
                    <img src="../images/mypage/icon-17.png" alt="">
                    <span>关于我们 </span>
                </li>
            </ul>
        </div>
        <ul class="footerbar">
            <li>
                <a href="#">
                    <img src="../images/icon/elf_06.png" alt="">
                    <div class="title">首页</div>
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="../images/icon/elf_22.png" alt="">
                    <div class="title">优选</div>
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="../images/icon/elf_25.png" alt="">
                    <div class="title">分类</div>
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="../images/icon/elf_41.png" alt="">
                    <div class="title">购物车</div>
                </a>
            </li>
            <li>
                <a href="#">
                    <img src="../images/icon/elf_43.png" alt="">
                    <div class="title">我的</div>
                </a>
            </li>
        </ul>
</body>

</html>